---
title: AstroサイトをMicrosoft Azureにデプロイする
description: Microsoft AzureでAstroサイトをウェブにデプロイする方法。
type: deploy
i18nReady: true
---

[Azure](https://azure.microsoft.com/)はMicrosoftのクラウドプラットフォームです。Microsoft Azureの[Static Web Apps](https://aka.ms/staticwebapps)サービスを使用してAstroサイトをデプロイできます。

このガイドでは、Visual Studio Codeを使用してGitHubに保存されているAstroサイトをデプロイする方法を説明します。その他のセットアップについては、[Azure Pipelinesタスク](https://learn.microsoft.com/ja-jp/azure/devops/pipelines/tasks/reference/azure-static-web-app-v0?view=azure-pipelines)の使用に関するMicrosoftのガイドをご覧ください。

## 前提条件

このガイドを進めるためには以下が必要です。

- Azureのアカウントとサブスクリプションキー。[ここで無料のAzureアカウント](https://azure.microsoft.com/free)を作成できます。
- アプリのコードが[GitHub](https://github.com/)にプッシュされていること。
- [Visual Studio Code](https://code.visualstudio.com/)の[SWA拡張機能](https://marketplace.visualstudio.com/items?itemName=ms-azuretools.vscode-azurestaticwebapps)。

## デプロイ方法

1. プロジェクトをVS Codeで開きます。

2. Static Web Apps拡張機能を開いてAzureにサインインし、**+** ボタンをクリックして新しいStatic Web Appを作成します。使用するサブスクリプションキーを指定するように求められます。

3. 拡張機能によって起動したウィザードに従い、アプリに名前を付け、フレームワークのプリセットを選択し、アプリのルート（通常は`/`）とビルドされたファイルの場所`/dist`を指定します。AstroはAzureのビルトインテンプレートにはリストされていないため、`custom`を選択する必要があります。ウィザードが実行され、リポジトリの`.github`フォルダに[GitHub Action](https://github.com/features/actions)を作成します。（このフォルダがまだ存在していない場合は自動的に作成されます。）

GitHub Actionがアプリをデプロイします（GitHub上のリポジトリのActionsタブから進行状況を確認できます）。正常に完了すれば、**Browse Website**ボタンをクリックしてSWA拡張機能の進行状況ウィンドウに表示されているアドレスからアプリを確認できます（これはGitHub Actionの実行後に表示されます）。

## 既知の問題

作成されるGitHub Actionのyamlはnode 14の使用を前提としています。これはAstroのビルドが失敗することを意味します。これを解決するには、プロジェクトのpackage.jsonファイルに次のスニペットを追加します。

```
  "engines": {
    "node": ">=18.0.0"
  },
```

## 公式リソース

- [Microsoft Azure Static Web Apps のドキュメント](https://learn.microsoft.com/ja-jp/azure/static-web-apps/)

## コミュニティリソース

- [AstroウェブサイトをAzure Static Web Appsにデプロイする](https://www.blueboxes.co.uk/deploying-an-astro-website-to-azure-static-web-apps)
